<%@page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<html>
<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css">
	<link rel="stylesheet" href="/static/jquery/css/ui-lightness/jquery-ui-1.9.2.custom.css">
	<script src="/static/jquery/js/jquery-1.8.3.js"></script>
	<script src="/static/jquery/js/jquery-ui-1.9.2.custom.js"></script>
	<script>
		$(function(){
			$("#q").autocomplete({
				source: function(request, response) {
					$.ajax({
						url: "<%request.getContextPath();%>/search_ajax",
						dataType: "json",
						data: {"q":$("#q").val()},
						success: function(data) {
							response($.map(data, function(item) {
								return {
									label: item
								}
							}));
						}
					});
				},
				minLength: 1
			});
		})
	</script>
</head>
<body>
	<div class="container">
		<h1>${message}</h1>
		<div class="well">
			<form action="/search" method="get">
				<label>搜索</label>
				 <input id="q" name="q" type="text">
				 <input type="submit">
			</form>
		</div>
	</div>
</body>
</html>